// useEffect: 副作用函数，组件加载或者组件更新的时候执行一些副作用
import { useEffect, useState } from "react"
export default function UseEffect(){
    const [count,setCount] = useState(0)
    const handleIncrement = ()=>{setCount(count-1)}
    const handleDecrement = ()=>{setCount(count+1)}
    // 默认组件创建后和组件重新渲染会自动执行，开启了严格模式，会执行两次
    // useEffect(()=>{
    //     console.log("useEffect")
    // })
    // 只在组件创建后执行一次
    // useEffect(()=>{
    //     console.log("useEffect")
    // },[])
    // 组件创建后和count变化会自动执行
    useEffect(()=>{
        console.log("useEffect")
    },[count])
    return (
        <div style={{padding:10}}>
        <button onClick={handleIncrement}>-</button>
        <span> {count} </span>
        <button onClick={handleDecrement}>+</button>
        </div>
    )
}